<!-- author: 薛皓文 -->
<!-- date: 2024-11-23 23:33:02 -->
<!-- description: 基于 uni-ui 组件 封装表单项 -->
<template>
    <!-- easyinput -->
    <uni-easyinput v-if="formType == 'easyinput'" v-model="modelValue" v-bind="_$attrs()"
        v-on="_listeners()"></uni-easyinput>
    <!-- calendar -- 日历 -->
    <template v-else-if="formType == 'calendar'">
        <G-calendar v-model="modelValue" v-bind="_$attrs()" v-on="_listeners()"></G-calendar>
    </template>
        <!-- combox -- 组合框组件 -->
         <G-combox  v-else-if="formType == 'combox'" v-model="modelValue" v-bind="_$attrs()" v-on="_listeners()" ></G-combox>

</template>
<script setup>
import {
    reactive,
    toRefs,
    ref,
    getCurrentInstance,
    computed,
    watch
} from 'vue';
import {
    onLoad
} from '@dcloudio/uni-app';

import globalHook from "@/hooks/globalHook.js"
const globalHookObj = globalHook();
const { _$attrs } = toRefs(globalHookObj);
const {
    getNewObj
} = globalHookObj;
const {
    proxy
} = getCurrentInstance();
//传参
const $props = defineProps({
    modelValue: {
        //所有类型
        type: [Number, String, Boolean, Array, Object, Function],
        default: () => {
            return undefined;
        },
    },
    //事件对象的集合
    listeners: {
        type: Object,
        default: () => {
            return {};
        },
    },
    //表单项类型
    formType: {
        type: String,
        required: true,
        default: "",
    },

    //下拉框，多选框 的数据配置 
    optionsInfo: {
        type: Object,
        default: () => {
            return {
                dictType: "",
                options: [],
            }
        }
    },
    //下拉框，多选框 的 事件
    optionsFunInfo: {
        type: Object,
        default: () => {
            return {}
        }
    }

});
const { formType } = toRefs($props);
//TODO hooks提出双向绑定
const $emit = defineEmits(["update:modelValue" ]);
//双向绑定
const modelValue = computed({
    get() {
        return $props.modelValue;
    },
    set(value) {
        $emit("update:modelValue", value);
    },
});
//多层调用组件的方法
const _listeners = computed(() => (excludeListeners = []) => {


    let $listeners = $props.listeners || {};
    let newListeners = {};
    // 不需要的属性名
    const _excludeListeners = excludeListeners;
    // 遍历 $listeners

    for (const key in $listeners) {
        if (Object.hasOwnProperty.call($listeners, key)) {
            const element = $listeners[key];

            if (!_excludeListeners.includes(key)) {
                newListeners[key] = element;
            }
        }
    }

    return newListeners;
});


onLoad(() => { });
</script>
<style lang="scss" scoped>
.container {}
</style>